import initMixin from "./init";
import { renderMixin } from './render';
import { lifeCycleMixin } from "./lifecycle";

function Vue(options) {
  this._init(options);
}

initMixin(Vue); // 后面需要扩展的方法都在这里面处理
renderMixin(Vue);
lifeCycleMixin(Vue);


import { compileToFunction } from "./compiler/index";
import { createEle, patch } from "./vdom/patch";

const vm1 = new Vue({
  data: {
    name: 'TOM',
    age: 100
  },
})

let template = `<ul>
  <li key="A">A</li>
  <li key="B">B</li>
  <li key="C">C</li>
  <li key="D">D</li>
</ul>`
let render = compileToFunction(template);
let oldVnode = render.call(vm1);
let ele = createEle(oldVnode);
document.body.appendChild(ele);


const t = setTimeout(() => {
  let templateNew = `<ul>
  <li key="A">A</li>
  <li key="B">B</li>
  <li key="C">C</li>
  <li key="D">D</li>
  <li key="E">E</li>
</ul>`
  let renderNew = compileToFunction(templateNew);
  let newVnode = renderNew.call(vm1);
  const el = patch(oldVnode, newVnode);
  clearTimeout(t)
  console.log('setTimeout', el)
}, 3000)

export default Vue;